<h1 id="toc">Pipes</h1>
<a href="#date-pipe">Date Pipe</a>
<a href="#date-pipe-formatting">Date Pipe Formatting</a>
<a href="#pipe-chaining">Pipe Chaining</a>
<a href="#power-booster">Power Booster custom pipe</a>
<a href="#hero-async-message">Async Messages and AsyncPipe</a>
<a href="#json-pipe">Json Pipe for Debugging</a>
<a href="#pipe-precedence">Pipes and Precedence</a>
<a href="#flying-heroes">Flying Heroes filter pipe (pure)</a>
<a href="#flying-heroes-impure">Flying Heroes filter pipe (impure)</a>

<hr />
<h2 id="date-pipe">Date Pipe</h2>
<app-birthday />

<hr />
<h2 id="date-pipe-formatting">Date Pipe Formatting</h2>
<app-birthday-formatting />

<hr />
<h2 id="pipe-chaining">Pipe Chaining</h2>
<app-birthday-pipe-chaining />

<hr />
<app-power-booster id="power-booster" />

<h2 id="pipe-precedence">Pipes and Precedence</h2>
<app-pipe-precedence />

<hr />
<app-hero-async-message id="hero-async-message" />

<hr />
<h2 id="json-pipe">Json Pipe for Debugging</h2>
<p>Use the JsonPipe to display component properties for debugging.</p>
<code>data | json</code>
<p>
  <app-json-pipe />
</p>

<hr />
<app-flying-heroes id="flying-heroes" />

<hr />
<app-flying-heroes-impure id="flying-heroes-impure" />
